<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>找回密码</title>
    <link rel="stylesheet" href="./css/index.css">
    
</head>

<body>
    <!--说明： 分为三个大模块是按照步骤，最开始只显示找回账号DOM，点击下一步后切换到下一个容器，上一个不显示，依次类推 -->
    <div class="title">
        <span class="active"><i>1</i>输入找回账号</span>
        <span><i>2</i>回答密保问题</span>
        <span><i>3</i>重置密码</span>
    </div>
    <div class="box">
        <div class="input-item">
            <label>请输入手机号：</label>
            <input type="text" name="sjh" id="ipt1">
        </div>
        <button id="sjh">下一步</button>
    </div>
    <!----------------------------------------------------->
    <br>
    <hr>
    <div class="title">
        <span><i>1</i>输入找回账号</span>
        <span class="active"><i>2</i>回答密保问题</span>
        <span><i>3</i>重置密码</span>
    </div>
    <div class="box">
        <div class="input-item">
            <label> 用户名：</label>
            <input type="text" value="xxxx" disabled>
        </div>
        <div class="input-item">
            <label> 手机号：</label>
            <input type="text" value="xxxx" disabled>
        </div>
        <div class="input-item">
            <label>密保问题：</label>
            <input type="text" value="xxxxxxx" disabled>
        </div>
        <div class="input-item">
            <label>密保答案：</label>
            <input type="text" id="ipt2" name="mimao">
        </div>
        <button>上一步</button>
        <button id="mibao">下一步</button>
    </div>
    <!----------------------------------------------------->
    <br>
    <hr>
    <div class="title">
        <span><i>1</i>输入找回账号</span>
        <span><i>2</i>回答密保问题</span>
        <span class="active"><i>3</i>重置密码</span>
    </div>
    <div class="box">
        <div class="input-item">
            <label>请输入新密码：</label>
            <input type="text" id="ipt3" name="mima">
        </div>
        <button>上一步</button>
        <button id="mima">立即重置</button>
    </div>
    <script src="/jquery.min.js"></script>
    <script src="/dizhi.js"></script>
    <script src="/axios.js"></script>
<script>
   
$(function(){
let uid = 0 
$('#sjh').on('click',async function(e){
    e.preventDefault()
    const {data:{data}} = await axios({
        url:'/user/findPwd',
        method:'GET',
        params:{
          phone:$('#ipt1').val()
        }
    })
    let popo = data.question
     uid = data.id
    // console.log(popo);

})

$('#mima').on('click',async function(e){
    e.preventDefault()

 const {data} = await axios({
    url:'/user/resetPwd',
    method:'POST',
    data:{
        id:''+uid,
        password:$('#ipt3').val(),
        answer:$('#ipt2').val()
    }
 })   
 alert('修改成功');
})





//     // console.log($('#ipt1').val());
//         $('#sjh').on('click',function(e){
//             // const popo= $('#ipt1').val()
//         e.preventDefault()
//         const popo= $('#ipt1').val()
//         let id=null
//         $.ajax({
//             method:'GET',
//             url:'/user/findPwd',
//             data:{
//                 phone:popo
//             },
//             success(res){
//         if(res.status !==200){
//           return console.log(res.msg);
//         }
//         console.log(res);
//         id= res.data.id
//         }
//     })
// })

// $('#mima').on('click',function(e){
//     e.preventDefault()
//     $.ajax({
//         url:'',
//         method:'',
        
//     })
// })






})


</script> 
</body>

</html>